import 'package:flutter/material.dart';

main() =>
    runApp(MaterialApp(debugShowCheckedModeBanner: false, home: HomePage()));
var shoeCover = 'https://i2.bvimg.com/688304/d3fdb6f1376264d8.jpg';
var bags = 'https://i2.bvimg.com/688304/2ec58d058e4f3bc3.png';
var sunglasses = 'https://i2.bvimg.com/688304/6e40903155495993.jpg';
var shoes = 'https://i2.bvimg.com/688304/9ec91d1164a9e17a.png';
var watches = 'https://i2.bvimg.com/688304/f6e287fab0125be6.png';

class HomePage extends StatefulWidget {
  @override
  createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  build(context) => Scaffold(
        bottomNavigationBar: BottomNavigationBar(
          type: BottomNavigationBarType.fixed,
          items: [
            BottomNavigationBarItem(
                icon: Icon(Icons.rss_feed), title: Text('现货')),
            BottomNavigationBarItem(
                icon: Icon(Icons.access_time), title: Text('抢购')),
            BottomNavigationBarItem(
                icon: Icon(Icons.shopping_basket), title: Text('提包')),
            BottomNavigationBarItem(
                icon: Icon(Icons.favorite_border), title: Text('收藏')),
            BottomNavigationBarItem(
                icon: Icon(Icons.person), title: Text('个人')),
          ],
        ),
        body: CustomScrollView(
          slivers: [
            SliverAppBar(
              expandedHeight: 400.0,
              flexibleSpace: FlexibleSpaceBar(
                background: Image.network(
                  shoeCover,
                  fit: BoxFit.cover,
                  colorBlendMode: BlendMode.darken,
                  color: Colors.black.withOpacity(0.4),
                ),
                title: Stack(
                  children: [
                    Positioned(
                      bottom: 0.0,
                      left: 0.0,
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            '新品',
                            style:
                                TextStyle(color: Colors.white, fontSize: 28.0),
                          ),
                          Text(
                            '发布',
                            style:
                                TextStyle(color: Colors.white, fontSize: 28.0),
                          ),
                        ],
                      ),
                    )
                  ],
                ),
              ),
            ),
            SliverList(
              delegate: SliverChildListDelegate([
                Padding(
                  padding: EdgeInsets.all(16.0),
                  child: Row(
                    children: [
                      Icon(Icons.search),
                      Expanded(
                        child: TextField(
                          decoration: InputDecoration(
                              border: InputBorder.none, hintText: '搜索'),
                        ),
                      )
                    ],
                  ),
                ),
                Row(
                  children: [
                    Expanded(
                      flex: 1,
                      child: Container(
                        height: 200.0,
                        decoration: BoxDecoration(
                            border:
                                Border(top: BorderSide(), right: BorderSide())),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          children: [
                            Container(
                              height: 100.0,
                              child: Image.network(sunglasses),
                            ),
                            Text(
                              '太阳镜',
                              style: TextStyle(
                                  fontWeight: FontWeight.bold, fontSize: 20.0),
                            )
                          ],
                        ),
                      ),
                    ),
                    Expanded(
                      flex: 1,
                      child: Container(
                        height: 200.0,
                        decoration: BoxDecoration(
                            border:
                                Border(top: BorderSide(), right: BorderSide())),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          children: [
                            Container(
                              height: 100.0,
                              child: Image.network(bags),
                            ),
                            Text(
                              '双肩包',
                              style: TextStyle(
                                  fontWeight: FontWeight.bold, fontSize: 20.0),
                            )
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
                Row(
                  children: [
                    Expanded(
                      flex: 1,
                      child: Container(
                        height: 200.0,
                        decoration: BoxDecoration(
                            border:
                                Border(top: BorderSide(), right: BorderSide())),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          children: [
                            Container(
                              height: 100.0,
                              child: Image.network(shoes),
                            ),
                            Text(
                              '运动鞋',
                              style: TextStyle(
                                  fontWeight: FontWeight.bold, fontSize: 20.0),
                            )
                          ],
                        ),
                      ),
                    ),
                    Expanded(
                      flex: 1,
                      child: Container(
                        height: 200.0,
                        decoration: BoxDecoration(
                            border:
                                Border(top: BorderSide(), right: BorderSide())),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          children: [
                            Container(
                              height: 100.0,
                              child: Image.network(watches),
                            ),
                            Text(
                              '手表',
                              style: TextStyle(
                                  fontWeight: FontWeight.bold, fontSize: 20.0),
                            )
                          ],
                        ),
                      ),
                    ),
                  ],
                )
              ]),
            )
          ],
        ),
      );
}
